<template>
  <app-dialog v-model="show" width="1000px" title="票单日志" @open="handleOpen">
    <el-table class="rizhitable" :data="pageData.list" height="53vh" v-loading="pageData.loading">
      <el-table-column label="日志状态" width="130" show-overflow-tooltip>
        <template #default="{ row }">
          <div v-if="row.status == 'error'" style="display: flex; align-items: center">
            <img style="width: 8px; height: 8px" src="@/assets/home/icon_wrong_red.png" />
            <div class="error">失败</div>
          </div>
          <div v-else style="display: flex; align-items: center">
            <img style="width: 8px; height: 8px" src="@/assets/home/icon_right_green.png" />
            <div class="success">成功</div>
          </div>
        </template>
      </el-table-column>

      <el-table-column label="日志内容" prop="msg" show-overflow-tooltip>
        <template #default="{ row }">
          <div style="color: #252a30">{{ row.msg }}</div>
        </template>
      </el-table-column>
      <el-table-column label="日志时间" width="250" prop="addtime" show-overflow-tooltip>
        <template #default="{ row }">
          <div style="color: #252a30">{{ row.addtime }}</div>
        </template>
      </el-table-column>
    </el-table>

    <el-pagination
      style="margin: 16px; float: right"
      @size-change="pageActions.handleSizeChange"
      @current-change="pageActions.handlePageChange"
      v-model:current-page="pageData.page"
      v-model:page-size="pageData.pageSize"
      layout="total, sizes, prev, pager, next, jumper"
      :total="pageData.total"
      background
    />
    <template #footer>
      <el-button @click="show = false">取消</el-button>
      <el-button class="hovepcvicecolor" type="primary" @click="show = false">确定</el-button>
    </template>
  </app-dialog>
</template>
  
  <script setup>
import { http } from '@/utils/http'
const show = defineModel({ type: Boolean })
const emits = defineEmits(['change'])
const props = defineProps({
  game: Object,
  task: Object,
  bctype: String,
})
const { pageData, pageActions, dialog } = usePage(
  () => {
    const query = {
      page: pageData.page,
      page_size: pageData.pageSize,
      task_type: props.task.task_type,
      task_code: props.task.task_code,
      pk_odds_key: props.game.pk_odds_key,
      ...pageData.query,
    }

    query.bc_type = props.bctype
    console.log(query)
    return http.get('/order/get_order_log', {
      params: query,
    })
  },
  {
    query: {},
  }
)

const handleOpen = () => {
  // console.log(props.game.order_list[0].bc_type)
  // console.log(props.task)
  setTimeout(() => {
    console.log(pageData)
  }, 3000)
}
</script>
  
  <style lang="scss" scoped>
.error {
  font-size: 14px;
  color: #f83e3e;
  margin-left: 4px;
}
.success {
  font-size: 14px;

  color: #02a66e;
  margin-left: 4px;
}

.rizhitable {
  border-radius: 8px;
  border: solid 1px #ebebeb;
}
</style>

<style>
.rizhitable .el-table__cell {
  padding: 12px 0;
}

.rizhitable .el-table__empty-block {
  width: 98% !important;
}
</style>